<%@ page language="java" contentType="text/html; charset=UTF-8" pageEncoding="UTF-8" %>
<%String path = request.getContextPath();%>
<%@ taglib uri="/WEB-INF/tld/c.tld" prefix="c" %>
<!DOCTYPE html>
<html lang="zh-CN">
<head>
    <meta charset="UTF-8">
    <title>小贷账单资方回购</title>
    <jsp:include page="../../import.jsp" flush="true"/>
    <script src="http://cdn.highcharts.com.cn/highcharts/highcharts.js"></script>
    <script src="http://cdn.highcharts.com.cn/highcharts/highcharts-3d.js"></script>
    <script src="http://cdn.highcharts.com.cn/highcharts-plugins/highcharts-zh_CN.js"></script>
    <script src="http://cdn.highcharts.com.cn/highcharts/modules/exporting.js"></script>
    <script type="text/javascript">
        $(function () {
            var chart = Highcharts.chart('container', {
                chart: {
                    type: 'spline'
                },
                title: {
                    text: '资方放款统计'
                },
                xAxis: {
                    type: 'datetime',
                    tickWidth: 0,
                    gridLineWidth: 1,
                    // 时间格式化字符
                    // 默认会根据当前的刻度间隔取对应的值，即当刻度间隔为一周时，取 week 值
                    dateTimeLabelFormats: {
                        second:'%Y-%m-%d',
                        minute:'%Y-%m-%d',
                        hour:'%Y-%m-%d',
                        day:'%Y-%m-%d',
                        week:'%Y-%m-%d',
                        month:'%Y-%m',
                        year:'%Y'
                    }
                },
                yAxis: [{ // 第一个 Y 轴，放置在左边（默认在坐标）
                    title: {
                        text: '资方'
                    },
                    labels: {
                        align: 'left',
                        x: 3,
                        y: 16,
                        format: '{value:.,0f}'
                    },
                    showFirstLabel: false
                }, {    // 第二个坐标轴，放置在右边
                    linkedTo: 0,
                    gridLineWidth: 0,
                    opposite: true,  // 通过此参数设置坐标轴显示在对立面
                    title: {
                        text: null
                    },
                    labels: {
                        align: 'right',
                        x: -3,
                        y: 16,
                        format: '{value:.,0f}'
                    },
                    showFirstLabel: false
                }],
                legend: {
                    align: 'left',
                    verticalAlign: 'top',
                    y: 20,
                    floating: true,
                    borderWidth: 0
                },
                exporting:{
                    // 是否允许导出
                    enabled:true,
                    // 按钮配置
                    buttons:{
                        contextButton:{
                            enabled:false
                        },
                        // 导出按钮配置
                        exportButton:{
                            //menuItems: null,
                            onclick: function() {
                                this.exportChart();
                            },
                            text:'B导出(PDF)'
                        },
                        // 打印按钮配置
                        printButton:{
                            //enabled:true,
                            onclick: function() {
                                this.print();
                            },
                            text:'A打印报表'
                        }
                    },
                    // 文件名
                    filename: encodeURI("放款走势图"),
                    // 导出文件默认类型
                    type:'application/pdf'
                },
                tooltip: {
                    shared: true,
                    crosshairs: true,
                    // 时间格式化字符
                    // 默认会根据当前的数据点间隔取对应的值
                    // 当前图表中数据点间隔为 1天，所以配置 day 值即可
                    dateTimeLabelFormats: {
                        second:'%Y-%m-%d',
                        minute:'%Y-%m-%d',
                        hour:'%Y-%m-%d',
                        day:'%Y-%m-%d',
                        week:'%Y-%m-%d',
                        month:'%Y-%m',
                        year:'%Y'
                    }
                },
                series: [{
                    name: '云信放款',
                    data: ${listMap}
                }, {
                    name: '五矿放款',
                    data: ${yxlistMap}
                }]
            });
        });
    </script>
    <style type="text/css">
        .searchArea .fieldBox .label{width: 60px; overflow: hidden; white-space: nowrap; text-overflow: ellipsis;}
    </style>
</head>

<body class="iframeBody">
<div class="Wrapper">
    <div class="fieldset1 tabel_col tabel_col_s clearFix">
        <div class="caption">
            <span class="title">小贷账单资方回购</span>
        </div>
        <table id="tableAst" class="sq-formTable no-border">
            <thead>
            <tr>
                <th class="tbLabel" style="text-align: center;background-color: #e7fef4;">合同号</th>
                <th class="tbLabel" style="text-align: center;background-color: #e7fef4;">客户姓名</th>
                <th class="tbLabel" style="text-align: center;background-color: #e7fef4;">应还总额</th>
                <th class="tbLabel" style="text-align: center;background-color: #e7fef4;">实还总额</th>
                <th class="tbLabel" style="text-align: center;background-color: #e7fef4;">未还本金</th>
                <th class="tbLabel" style="text-align: center;background-color: #e7fef4;">未还利息</th>
                <th class="tbLabel" style="text-align: center;background-color: #e7fef4;">未还罚息</th>
                <th class="tbLabel" style="text-align: center;background-color: #e7fef4;">放款时间</th>
                <th class="tbLabel" style="text-align: center;background-color: #e7fef4;">回购金额</th>
            </tr>
            </thead>
            <tbody>
            </tbody>
        </table>
    </div>
    <div id="ligergrid1" class="sq-grid"></div>
    <div id="container" style="min-width:400px;height:400px"></div>
</div>


<script type="text/javascript">
    var grid = null;
    var result = null;
    $(function() {
        /* $("#formCrInfo").ligerForm({
             validate: true
         });*/
        initData();
    });

    function initData(){
        var idS='${idS}';
        if(!idS)  return;
        var _url = '<%=path%>/mcr/mcrBillM/initHgList.do';
        AjaxUtils.ajaxPost(_url, {ids:idS}, callback);
    }

    //新增回调
    function callback(msg){
        if(msg.success == 1){
            setData(msg.data);//设置数据
        }else{
            UIUtils.alertError(msg.info);
        }
    }
    //新增回调
    function addCallback(msg){
        if(msg.success == 1){
            parent.grid.reload();
            parent.$.ligerDialog.SQalert({content:msg.info, SQ_type: "success"});
            // UIUtils.alertSuccess("操作成功!");
            frameElement.dialog.close();
        }else{
            UIUtils.alertError(msg.info);
        }
    }

    //设置页面数据
    function setData(data){
        result = data;
        var bean=data["bean"];
        //var historyList=data["historyList"];
        /* $("#crId").html(crBaseInfoVO.crId);
         $("#crNm").html(crBaseInfoVO.crNm);
         $("#crCtrNo").html(crBaseInfoVO.crCtrNo);
         $("#crSbj").html(crBaseInfoVO.crSbjNm);
         $("#crLmt").html(moneyChange(crBaseInfoVO.crLmt));
         $("#rvlCr").html(crBaseInfoVO.rvlCrNm);
         $("#ccyTp").html(crBaseInfoVO.ccyTpNm);
         $("#stDt").html(renderDateChange(crBaseInfoVO.stDt));
         $("#edDt").html(renderDateChange(crBaseInfoVO.edDt));
         $("#rmrk").html(crBaseInfoVO.rmrk);
         $("#fncInsNm").html(crBaseInfoVO.fncInsNm);
         $("#crStNm").html(crBaseInfoVO.crStNm);
         $("#scmDsc").html(crBaseInfoVO.scmDsc);
         $("#isPartIn").html(crBaseInfoVO.isPartInNm);*/
        printAstInfo(bean);
    };
    //显示资产信息
    function printAstInfo(bean){
        var astList=bean.voList;
        if(astList!=null&&astList.length>0){
            for(var i in astList){
                addAstNext(astList[i]);
            }
        }
    }


    var ltextfield ='position: absolute;'
        +' top: 0px;'
        +' left: 0px;'
        +' height: auto;'
        +' line-height: 18px;'
        +' padding-left: 0px;'
        +' padding-top: 0px;'
        +' padding-bottom: 0px;'
        +' vertical-align: middle;'
        +' background-color: #fff;'
        +' width: 174px;'
        +' border: 0;'
        +' margin: 0;'
        +' outline: none;'
        +' color: #555555;'
        +' border-radius: 4px;';

    var ltext ='position: relative;'
        +' border: 1px solid #e9e9e9;'
        +' height: auto;'
        +' line-height: 18px;'
        +' width: 178px;'
        +' border-radius: 4px;';


    var field ='display: inline-block;'
        +'vertical-align: top;'
        +' height: auto;'
        +' line-height:1.5em;'
        +' border-spacing: 0;'
        +' width: 100px;'
        +' border-collapse: collapse;';

    //初始化列表
    function addAstNext(vo) {
        //添加行
        var tableAst = document.getElementById("tableAst");
        var  rowIndex = tableAst.rows.length;//默认在末尾插入一行
        var row = tableAst.insertRow(rowIndex);//在表格的指定插入一行
        //设置添加行的内容
        var innerHTML ='<td style="text-align: center;">'
            +'<div style="'+ field +'">'
            + '<span>'+vo.crCntNo+'</span>'
            + '</div>'
            +'</td>'
            +'<td style="text-align: center;">'
            +'<div style="'+ field +'">'
            +'<span>'+vo.cstNm+'</span>'
            +'</div>'
            +'</td>'
            +'<td style="text-align: center;">'
            +'<div style="'+ field +'">'
            +'<span>'+vo.yhTotalAmt/100+'</span>'
            +'</div>'
            +'</td>'
            +'<td style="text-align: center;">'
            +'<div style="'+ field +'">'
            +'<span>'+vo.shTotalAmt/100+'</span>'
            +'</div>'
            +'</td>'
            +'<td style="text-align: center;">'
            +'<div style="'+ field +'">'
            +'<span>'+vo.arCapAmt/100+'</span>'
            +'</div>'
            +'</td>'
            +'<td style="text-align: center;">'
            +'<div style="'+ field +'">'
            +'<span>'+vo.arIntrAmt/100+'</span>'
            +'</div>'
            +'</td>'
            +'<td style="text-align: center;">'
            +'<div style="'+ field +'">'
            +'<span>'+vo.arFineAmt/100+'</span>'
            +'</div>'
            +'</td>'
            +'<td style="text-align: center;">'
            +'<div style="'+ field +'">'
            +'<span>'+getMyDate(vo.crDt)+'</span>'
            +'</div>'
            +'</td>'
            +'<td style="text-align: center;">'
            +'<div style="'+ field +'">'
            +'<span>'+vo.settleAmt/100+'</span>'
            +'</div>'
            +'</td>'
        row.innerHTML=innerHTML;
    }


    //格式化时间
    function renderDate(rowdata, index, value) {
        var dateStr = "";
        if (null != value) {
            var date = new Date(value);
            dateStr = DateUtils.formatDate(date, DateUtils.YYYY_MM_DD);
        }
        return dateStr;
    }

    function getMyDate(str){
        var oDate = new Date(str),
            oYear = oDate.getFullYear(),
            oMonth = oDate.getMonth()+1,
            oDay = oDate.getDate(),
            oHour = oDate.getHours(),
            oMin = oDate.getMinutes(),
            oSen = oDate.getSeconds(),
            oTime = oYear +'-'+ getzf(oMonth) +'-'+ getzf(oDay) ;//最后拼接时间
        return oTime;
    };
    //补0操作
    function getzf(num){
        if(parseInt(num) < 10){
            num = '0'+num;
        }
        return num;
    }

    //定义父级调用事件
    frameElement.dialog.onOk = function () {
        save();
    }

    frameElement.dialog.onCancel = function () {
        frameElement.dialog.close();
    }

    //保存
    function save(){
        var url = '<%=path%>/mcr/mcrBillM/hgSend.do';
        var idS='${idS}';
        AjaxUtils.ajaxPost(url, {"idS":idS}, addCallback);
       // AjaxUtils.ajaxPost(url, {"data":JSON.stringify(result)}, addCallback);
    }

</script>

</body>
</html>
